<template>
	<view class="usermain">
		<view class="userImg">
			<image src="../../static/imgs/userpage.png"></image>
		</view>
		<view class="usercontent">
			<view class="uc_head">
				<view class="uch_left">
					<view class="uch_img">
						<image src="/static/imgs/user_img.png"></image>
					</view>
					<view class="uch_user">
						<view class="uch_name">
							<text>暂未登录</text>
						</view>
						<view class="uch_desc">
							<text>点击登录 享受更多权益</text>
						</view>
					</view>
				</view>
				<view class="uch_right">
					<image src="/static/imgs/back.png"></image>
				</view>
			</view>
			
			<view class="uc_action">
				<view class="uca_title">
					<text>贷款服务</text>
				</view>
				<view class="uca_content">
					<view class="ucac_view">
						<view class="ucacv_title">
							<text>申请贷款</text>
						</view>
						<view class="ucacv_desc">
							<text>立刻申请</text>
							<image src="/static/imgs/back.png"></image>
						</view>
						
						<view class="bottom_img">
							<image src="../../static/imgs/shenqingdaikuan .png"></image>
						</view>
					</view>
					
					<view class="ucac_view" style="margin-left: 26rpx;">
						<view class="ucacv_title">
							<text>申请记录</text>
						</view>
						<view class="ucacv_desc">
							<text>查看详情</text>
							<image src="/static/imgs/back.png"></image>
						</view>
						<view class="bottom_img">
							<image src="../../static/imgs/daikuanjilu.png"></image>
						</view>
					</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				
			}
		},
		methods: {
			
		}
	}
</script>

<style>
	.usermain{
		width: 100%;
		height: 100vh;
		position: relative;
	}
	.userImg{
		width: 100%;
		height: 100%;
		position: absolute;
		top: 0;
		left: 0;
	}
	.userImg image{
		width: 100%;
		height: 100%;
	}
	.usercontent{
		width: 100%;
		height: 100%;
		position: relative;
		top: 0;
		left: 0;
		z-index: 99;
		display: inline-block;
	}
	.uc_head{
		width: 100%;
		height: 126rpx;
		display: flex;
		align-items: center;
		justify-content: space-between;
		margin-top: 200rpx;
		padding: 0 30rpx;
		box-sizing: border-box;
	}
	.uch_left{
		display: flex;
		align-items: center;
		justify-content: flex-start;
	}
	.uch_img{
		width: 126rpx;
		height: 126rpx;
		display: flex;
		align-items: center;
		justify-content: center;
	}
	.uch_img image{
		width: 100%;
		height: 100%;
	}
	.uch_right{
		width: 49rpx;
		height: 49rpx;
		display: flex;
		align-items: center;
		justify-content: center;
	}
	.uch_right image{
		width: 100%;
		height: 100%;
	}
	.uch_user{
		flex: 1;
		margin-left: 30rpx;
	}
	.uch_name{
		font-size: 36rpx;
		color: #222222;
		line-height: 50rpx;
		text-align: left;
		font-weight: bold;
	}
	.uch_desc{
		font-size: 28rpx;
		color: #999999;
		line-height: 40rpx;
		margin-top: 12rpx;
	}
	.uc_action{
		width: calc(100% - 60rpx);
		margin-left: 30rpx;
		border-radius: 14rpx;
		background: #fff;
		padding: 30rpx;
		box-sizing: border-box;
		margin-top: 50rpx;
	}
	.uca_title{
		width: 100%;
		display: flex;
		align-items: center;
		justify-content: flex-start;
		font-size: 28rpx;
		color: #1A1B20;
		font-weight: bold;
		margin-top: 15rpx;
	}
	.uca_content{
		width: 100%;
		display: flex;
		align-items: center;
		justify-content: flex-start;
		margin-top: 25rpx;
	}
	.ucac_view{
		flex: 1;
		height: 144rpx;
		border-radius: 18rpx;
		background: #f7f8f9;
		display: inline-block;
		position: relative;
	}
	.ucacv_title{
		width: 100%;
		font-size: 34rpx;
		color: #222222;
		text-align: left;
		padding-left: 28rpx;
		font-weight: bold;
		margin-top: 15rpx;
	}
	.ucacv_desc{
		display: flex;
		align-items: center;
		justify-content: flex-start;
		margin-top: 16rpx;
		padding-left: 28rpx;
	}
	.ucacv_desc text{
		font-size: 24rpx;
		color: #6F7985;
	}
	.ucacv_desc image{
		width: 26rpx;
		height: 26rpx;
		margin-left: 14rpx;
	}
	.bottom_img{
		position: absolute;
		right: 0;
		bottom: 0;
		width: 105rpx;
		height: 66rpx;
		display: flex;
		align-items: center;
	}
	.bottom_img image{
		width: 100%;
		height: 100%;
	}
	</style>
